<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /* 侧边导航样式 */
        .sidebar {
            width: 150px;
            background-color: #f8f9fa;
            box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
        }

        .sidebar-sticky {
            position: sticky;
            top: 0;
            height: calc(100vh - 56px);
            padding-top: .5rem;
            overflow-x: hidden;
            overflow-y: auto;
        }

        .nav-link {
            font-weight: 500;
            color: #333;
        }

        .nav-link:hover{
            color: #007bff;
            background-color: #e0e4e6;
        }
        .nav-link.active{
            color: #007bff;
            background-color: #e0e4e6;
        }
    </style>

</head>
<body>

<nav class="sidebar">
    <div class="position-sticky pt-3 sidebar-sticky">
        <ul class="nav flex-column">
            <li class="nav-item">
                <a class="nav-link" th:href="@{/Student/list/1/3}" data-target="student-list" onclick="showContent('student-list')">
                    学生
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" th:href="@{/Teacher/list/1/3}" data-target="teacher-list" onclick="showContent('teacher-list')">
                    教师
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" th:href="@{/Course/list/1/3}" data-target="course-list" onclick="showContent('course-list')">
                    课程
                </a>
            </li>
        </ul>
    </div>
</nav>
</body>
</html>